<template>
    <div>
        用户名<input type="text" v-model="cx.Yname">
        <select v-model="cx.Ylxid">
                            <option v-for="d in xl" :value="d.Lid">{{d.Lname}}</option>
        </select>
        <input type="button" value="查询" @click="xianshi">
         <table class="table">
               <thead> 
                   <tr>
                        <td>用户名</td>
                        <td>联系方式</td>
                        <td>证件类型</td>
                        <td>证件号码</td>
                        <td>性别</td>
                        <td>生日</td>
                        <td>职业类型</td>
                        <td>状态</td> 
                        <td>地址</td>
                   </tr>
               </thead>
               <tbody>
                     <tr v-for="d in data">
                        <td>{{d.Yname}}</td>
                        <td>{{d.Ylxfs}}</td>
                        <td>{{d.Yzjlx}}</td>
                        <td>{{d.Yzjhm}}</td>
                        <td>{{d.Yxb}}</td>
                        <td>{{d.Ysr}}</td>
                        <td>{{d.Lname}}</td> 
                        <td>{{d.Yzt}}</td>
                        <td>{{d.Ydz}}</td>
                   </tr>
               </tbody>
         </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios'
import {ref,onMounted} from 'vue'
import {useRouter} from 'vue-router'

const data = ref([{
    "Yid": 2,
    "Yname": "郭富豪",
    "Ylxfs": "13526230346",
    "Yzjlx": "身份证",
    "Yzjhm": "411628200939039188",
    "Yxb": "男",
    "Ysr": "2025-06-26T00:00:00",
    "Ylxid": 1,
    "Yzt": 1,
    "Ydz": "河南省周口市",
    "Lname": "老师"
}])

const xianshi=()=>{
    axios.get("https://localhost:7196/api/ZK/Show",{params:cx.value}).then(res=>{
        data.value = res.data
    })
}

const cx = ref({
    Yname:"",
    Ylxid:0
})

onMounted(()=>{
    Bang();
    xianshi();
})

const xl = ref([{
    "Lid": 1,
    "Lname": "老师"
}])

const Bang=()=>{
    axios.get("https://localhost:7196/api/ZK/Bang").then(res=>{
        xl.value = res.data
    })
}

</script>

<style scoped>

</style>